<template>
	<view class="custom-red" @click="jumpCustom(message)">
		<image class="custom-red-image" :src="cdn(message.payload.custom.imgUrl)"
			mode="aspectFill"></image>
		<view class="custom-red-title ss-line-1">{{message.payload.custom.title}}</view>
	</view>
</template>

<script setup>
	import sheep from '@/sheep';
	import {cdn,udid} from '@/im/config/index.js'
	
	const props = defineProps({
		message: {
			type: Object,
			default: {}
		}
	})
	
	const jumpCustom = (msg) => {
		if (udid === msg.payload.custom.tag) {
			uni.navigateTo({
				url: msg.payload.custom.linkUrl
			})
		} else {
			uni.showToast({
				title: '请前往指定平台查看详情!',
				icon: 'none',
				duration: 2000
			});
		}
	}
</script>

<style scoped lang="scss">
	view {
		box-sizing: border-box;
	}
	
	.custom-red {
		width: 452rpx;
		height: 130rpx;
		position: relative;
	
		.custom-red-image {
			width: 452rpx;
			height: 130rpx;
			border-radius: 5rpx;
		}
	
		.custom-red-title {
			width: 100%;
			font-weight: 500;
			font-size: 24rpx;
			color: #FFFFFF;
			position: absolute;
			left: 0;
			top: 32rpx;
			padding: 0 20rpx 0 96rpx;
		}
	}
</style>